<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <title></title>
  <title>leg-tree</title>
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
</head>
<style>
  .tree {
    display: block;
    margin: auto;
    position: relative;
    padding-left: 20px;
  }

  a {
    text-decoration: none;
    color: #2C8DFB;
  }

  ul li {
    list-style-type: none;
    margin-left: -10px;
    position: relative;
  }

  .tree input {
    cursor: pointer;
  }

  .tree input.select-part+.label {
    background-image: url("");
  }

  .tree span {
    font-size: 13px;
    cursor: pointer;
    display: inline-block;
    border: 1px solid #e2e2e2;
    width: 10px;
    line-height: 8px;
    text-align: center;
    height: 10px;
    background-color: whitesmoke;
    position: absolute;
    left: 8px;
    top: 4px;
  }

  .tree ul span {
    left: -16px;
  }

  .tree ul {
    list-style-type: none;
    margin-top: 0px;
    position: relative;
  }

  .label:hover {
    box-shadow: 0 0 4px 0px #a0aefb;
  }

  .label {
    width: 18px;
    height: 18px;
    position: inherit;
    top: 4px;
    background-image: url("");
    background-size: 100% 100%;
    display: inline-block;
    margin: 1px 5px 0 0;
  }

  input:checked+label {
    width: 19px;
    height: 19px;
    margin: 0 4px 0 0;
    background-image: url("");
  }

  input {
    display: none;
  }

  .isShow {
    width: 14px;
    margin-right: 5px;
  }
</style>

<body>

  <div class="tree">
  </div>
  <div class="tree1">
  </div>
  <button id="demo">获取选中数据</button>
</body>
<script src="https://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script src="sg-tree.js" type="text/javascript" charset="utf-8"></script>
<script>
  var data = [{
    "id": "1",
    "name": "Root",
    "open": true,
    "cascade": true,
    "checked": false,
    "children": [
      {
        "id": "11",
        "name": "Agent",
        "open": false,
        "checked": false,
        "children": [{
          "id": "111",
          "name": "Member1",
          "checked": true,
          "open": true,
          "children": []
        },
        {
          "id": "112",
          "name": "Member2",
          "checked": false,
          "open": true,
          "children": []
        }
        ]
      }
    ]
  }];

  var arrs = []
  $(".tree").tree(data, arrs);

  $("#demo").on("click", () => {
    alert($.getCheckedNodes());//获取选中的ID
  })
</script>

</html>